<template>
    <div class="content">
        <div id="map"></div>
    </div>
</template>

<script>
import $ from 'jquery'
export default {
    name: 'smallMap',
    props: {
        
    },
    data() {
        return {
           
        }
    },
    mounted() {
    var map, layer, host = window.isLocal ? window.server : "http://192.168.20.251:8090";
    var url = host + "/iserver/services/map-World/rest/maps/twofloors";
      map = new SuperMap.Map("map", {
        controls: [
            new SuperMap.Control.Navigation(),
            new SuperMap.Control.Zoom()]
    });
    map.addControl(new SuperMap.Control.MousePosition());
    layer = new SuperMap.Layer.TiledDynamicRESTLayer("twofloors", url, null, {maxResolution: "auto"});
    layer.events.on({"layerInitialized": addLayer});

    function addLayer() {
        map.addLayer(layer);
        map.setCenter(new SuperMap.LonLat(109.531430172039 , 18.3099806606528), 0);
    }
    // console.log(map.layers);

      var urll = "http://192.168.20.251:8090/iserver/services/map-World/rest/maps/twofloors";
        var TILESIZE = 256;
        var TRANSPARENT = false;
        var TILEFORMAT = "PNG"
        

        var tileSets = null;

      var mapURI = encodeURI("http://192.168.20.251:8090/iserver/services/map-World/rest/maps/twofloors");
            var tilesetURI = mapURI+ "/tilesets.json?tileSize=" + TILESIZE + "&transparent=" +TRANSPARENT +  "&tileFormat=" + TILEFORMAT;
            $.ajax({
                type: "GET",
                url: tilesetURI,
                dataType: "json",
                async : false,
                success: function(data) {
                    var tileSet = JSON.stringify(data);
                    tileSets = JSON.parse(tileSet);
                    console.log(tileSets);
                }
            });


            var queryUrl = encodeURI(urll)+"/queryResults.json?returnPostAction=true&getMethodForm=true&returnContent=true";
            // var entity = '{"queryMode":"SqlQuery","queryParameters": {"queryParams": [{"attributeFilter": "1=2","name":"'+ layerName+'"}]}}';
            var request = SuperMap.Request.GET({
                url: queryUrl,
                callback: function () {
                    if (request.status < 400) {
                        var data = new SuperMap.Format.JSON().read(request.responseText);
                        // if(data.recordsets.length > 0){
                            // var fields = data.recordsets[0].fields;
                            // layerFields[layerName] = fields;
                            // displayFieldsToUI(fields);
                            console.log(data);
                        // }
                    }  
                     },
                scope: this
            }); 
                
    },
    methods: {
       
    },
}
</script>

<style lang="less" scoped>
@import '../../../assets/less/school.less';

.content {
    width: 100%;
    height: 100%;
    #map {
        width: 100%;
        height: 100%;
    }
}
</style>